<template>
  <j-modal title="匹配供应商" :width="1200" :visible.sync="modalVisible" :maskClosable="false">
    <a-table
      bordered
      :columns="modalColumns"
      :data-source="tableData"
      rowKey="id"
      :loading="loadingModalTable"
      :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: 'radio' }"
      :pagination="false"
    >
      <template #nameSlot="text, record">
        <span v-if="record.izDefault == 1" style="color: red">[默认]</span>{{ record.name }}
      </template>
    </a-table>
    <template #footer>
      <a-button @click="modalVisible = false"> 取消 </a-button>
      <a-button type="primary" @click="handleOk"> 确定 </a-button>
    </template>
  </j-modal>
</template>

<script>
import { getAction } from '@/api/manage'
import { filterDictTextByCache } from '@/components/dict/JDictSelectUtil.js'

export default {
  props: {
    // 是否显示弹框
    visible: {
      type: Boolean,
      default: false,
    },
    purchaseWay: {
      type: String,
    },
    productSupperId: {
      type: String,
      default: '',
    },
    productId: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      modalVisible: this.visible,
      loadingModalTable: false,
      checkObjs: {},
      selectedRowKeys: [],
      tableData: [],
      modalColumns: [
        {
          title: '供应商编号',
          align: 'center',
          dataIndex: 'code',
        },
        {
          title: '供应商名称',
          align: 'center',
          dataIndex: 'name',
          scopedSlots: {
            customRender: 'nameSlot',
          },
        },
        {
          title: '供应商类型',
          align: 'center',
          customRender(text, record) {
            return record.type == 1 ? '1688采购' : '其他采购'
          },
        },
        {
          title: '供应商规格',
          align: 'center',
          dataIndex: 'specsSup',
        },
        {
          title: '入库规格',
          align: 'center',
          dataIndex: 'specsMy',
        },
        {
          title: '参考价(元)',
          align: 'center',
          dataIndex: 'unitPrice',
        },
        {
          title: '状态',
          align: 'center',
          customRender(text, record) {
            return filterDictTextByCache('product_supplier_status', record.supplierStatus)
          },
        },
      ],
      url: {
        queryArchiveSupplier: '/hzkj-product/product/archive/hzArchiveInfoBasic/queryHzArchiveInfoSupplierByMainId',
        querySupplierByIds: '/hzkj-product/product/productLibrary/supplier/queryByIds',
      },
    }
  },
  watch: {
    modalVisible(val) {
      this.$emit('update:visible', val)
    },
  },
  methods: {
    onSelectChange(keys, objs) {
      this.selectedRowKeys = keys
      this.checkObjs = objs[0]
    },
    // 产品提交
    handleOk() {
      if (!this.checkObjs.id) {
        this.$message.warning('请选择供应商')
        return
      }
      if (this.purchaseWay == '1' && this.checkObjs.type != 1) {
        this.$message.warning('请选择1688供应商')
        return
      }
      this.$emit('submit', this.checkObjs)
      this.modalVisible = false
    },
  },
  created() {
    this.loadingModalTable = true
    getAction(this.url.queryArchiveSupplier, { id: this.productId }).then((res1) => {
      if (res1.success) {
        let supplierList = res1.result
        getAction(this.url.querySupplierByIds, { ids: supplierList.map((i) => i.supplierId).join(',') }).then(
          (res2) => {
            if (res2.success) {
              this.loadingModalTable = false
              this.tableData = supplierList.map((i1) => {
                let findItem = res2.result.find((i2) => i1.supplierId == i2.id)
                return {
                  ...i1,
                  code: findItem.code,
                  supplierStatus: findItem.supplierStatus,
                }
              })
              if (this.productSupperId) {
                this.selectedRowKeys = [this.productSupperId]
                this.checkObjs = supplierList.find((i) => i.id == this.productSupperId)
              }
            } else {
              this.$message.error(res2.message)
            }
          }
        )
      } else {
        this.$message.error(res1.message)
      }
    })
  },
}
</script>
